import React, {Component} from 'react';
import {Input, InputNumber, Button, Form, Select} from 'antd';
import {reqCompanyInformation, reqUpdateCompanyInformation} from '../../api/index';
import './com_information_update.less';

/*
* 公司信息路由*/

class UpdateComInformation extends React.Component {

    state = {
        companyInformation: [],//总的公司信息列表
    }

    //异步获取公司基本信息

    getCompanyInformation = async () => {

        //发异步ajax请求，获取数据
        const result = await reqCompanyInformation()
        const companyInformation = result.data.results
        //更新状态
        this.setState({
            companyInformation
        })
        this.id = companyInformation.map(i => {
            return i.id
        })
    }

    //发异步ajax请求
    componentDidMount() {
        this.getCompanyInformation()
    }

    //为第一次render()准备数据
    componentWillMount() {
        this.initColumns()
    }

    //初始化Table所有列的数组
    initColumns = () => {

    }

    submit = () => {
        //进行表单验证，如果通过了，才发送请求
        this.props.form.validateFields(async (err, values) => {
            if (!err) {
                //1、搜集数据
                const companyId=this.id
                const {a1, a2, a3, a4, a5, a6, a7} = values
                const name = a1.toString()
                const contact = a4.toString()
                const contact_phone = a5.toString()
                const describe = a2.toString()
                const address = a3.toString()
                const updateComInformation = {
                    name, contact, contact_phone, describe, address
                }
                //2、调用接口请求函数去添加/更新
                const result = await reqUpdateCompanyInformation(updateComInformation,companyId)
                //跳转到充值界面
                this.props.history.push('/com_information')
                //3、根据结果提示
            } else {
                console.log('发送ajax请求失败 ');
            }
        });
    }

    handleSubmit = e => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                console.log('Received values of form: ', values);
            }
        });
    };

    render() {
        //读取状态数据
        const {getFieldDecorator} = this.props.form;
        const {companyInformation} = this.state
        const name = companyInformation.map(i => {
            return i.name
        })
        const contact = companyInformation.map(i => {
            return i.contact
        })
        const contact_phone = companyInformation.map(i => {
            return i.contact_phone
        })
        const describe = companyInformation.map(i => {
            return i.describe
        })
        const address = companyInformation.map(i => {
            return i.address
        })
        const points = companyInformation.map(i => {
            return i.points
        })
        const credit = companyInformation.map(i => {
            return i.credit
        })
        const {TextArea} = Input;
        return (
            <div className="recruit">
                <div><h1>修改公司信息</h1></div>
                <Form layout="inline" onSubmit={this.handleSubmit}>
                    <div className="recruit-style">
                        <div>
                            <Form.Item label="公司名称">
                                {getFieldDecorator('a1', {
                                    initialValue: name
                                })(<Input className="recruit-style-input"/>)}
                            </Form.Item>
                        </div>
                        <div><Form.Item label="公司介绍">{getFieldDecorator('a2', {
                            initialValue: describe
                        })(<TextArea rows={6}/>)}</Form.Item></div>
                        <div><Form.Item label="公司地址">{getFieldDecorator('a3', {
                            initialValue: address
                        })(<Input className="recruit-style-input2"/>)}
                        </Form.Item></div>
                        <div><Form.Item label="联系人">{getFieldDecorator('a4', {
                            initialValue: contact
                        })(<Input className="recruit-style-input1"/>)}
                        </Form.Item></div>
                        <div><Form.Item label="联系电话">{getFieldDecorator('a5', {
                            initialValue: contact_phone
                        })(<Input className="recruit-style-input2"/>)}
                        </Form.Item></div>
                        <div><Form.Item label="积分">{getFieldDecorator('a6', {
                            initialValue: points
                        })(<InputNumber className="recruit-style-inputnumber1" readOnly={true}/>)}
                        </Form.Item></div>
                        <div><Form.Item label="信用分">{getFieldDecorator('a7', {
                            initialValue: credit
                        })(<InputNumber className="recruit-style-inputnumber2" readOnly={true}/>)}
                        </Form.Item></div>
                    </div>
                    <Form.Item>
                        <Button type="primary" htmlType="submit" onClick={this.submit}>
                            修改公司信息
                        </Button>
                    </Form.Item>
                </Form>
            </div>
        )
    }
}

const WrappedUpdateComInformation = Form.create()(UpdateComInformation);
export default WrappedUpdateComInformation;